<template>
	<view class="custom-meu-container">
		<u-grid :border="false" col="4">
			<u-grid-item v-for="(item,baseListIndex) in menuList" @click="handleClick(item.id)" :key="baseListIndex">
				<image class="grid-item-image" :src="item.icon"></image>
				<text class="grid-text">{{item.name}}</text>
			</u-grid-item>
		</u-grid>
	</view>
</template>

<script>
	export default {
		name: 'custommenu',
		props: {
			menuList: {
				type: Array,
				default: []
			}
		},
		data() {
			return {
			}
		},
		methods: {
			handleClick(id) {
				let menu = this.menuList.find(item => item.id == id);
				if(menu.children) { //如果有children则是目录，接着跳转
					this.$tab.navigateTo('/pages/common/publicmenu/index?id=' + id)
				} else {
					this.$tab.navigateTo(`/${menu.path}`)
				}
				
			}
		}
	}
</script>

<style scoped>
	.custom-meu-container {
		margin-top:10px;
	}
	.grid-item-image {
		width: 34px;
		height: 34px;
		margin-bottom: 6px;
	}
</style>